import {
    arrayToObject
} from '../../../../assets/js/util.js'
export default {
    data() {
        return {
            /*当前页显示数量*/
            pageSize: 10,
            /*每页显示的数量*/
            pageSizes: [10, 20, 50, 100],
            /*dataTotal表数量*/
            dataTotal: 0,
            /*分页器*/
            currentPage: 1,
            loading: false,
            // 通用的请求地址
            SRC: '',
            title: '实时战力变动原因流水',
            // 设置时间 一周， 一月，  昨天
            pickerOptions: {
                shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近一个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近三个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                        picker.$emit('pick', [start, end]);
                    }
                }]
            },
            // 存放获取到的平台数
            plats: [],
            // 存放获取到的渠道数
            channels: [],
            // 存放获取到的区服数
            serviceAreas: [],
            // 类型列表
            types: [],
            // 提交的表单
            form: {
                dateOne: '',
                dateStart: '',
                dateEnd: '',
                plat: '',
                channel: '',
                serviceArea: '',
                auID: '',
                roleId: '',
                type: ''
            },
            // 表单验证
            rules: {
                plat: [{
                    required: true,
                    message: '请选择平台',
                    trigger: 'change'
                }],
                channel: [{
                    required: true,
                    message: '请选择渠道',
                    trigger: 'change'
                }],
                serviceArea: [{
                    required: true,
                    message: '请选择区服',
                    trigger: 'change'
                }],
                typeArea: [{
                    required: true,
                    message: '请选择类型',
                    trigger: 'change'
                }],
                auID: [{
                    min: 3,
                    max: 50,
                    message: '长度在 3 到 50 个字符',
                    trigger: 'blur'
                }],
                roleId: [{
                    min: 3,
                    max: 50,
                    message: '长度在 3 到 50 个字符',
                    trigger: 'blur'
                }]
            },
            // 工会ID输入框的宽
            inputWidth: '220px',
            // 所有el-form-item label的宽度
            formLabelWidth: '120px',
            /*表格数据*/
            tableData: [],
            /*表格数据全部*/
            tableDataAll: [],
            /*realTimeServiceContent 的宽*/
            realTimeServiceContent: '100%',
            /*表的宽度*/
            realTimeServiceTableWidth: "100%",
            /*数据表头*/
            tableHeader: [{
                prop: 'innerId',
                label: '时间'
            }, {
                prop: 'plat',
                label: '平台'
            }, {
                prop: 'channel',
                label: '渠道'
            }, {
                prop: 'serviceArea',
                label: '区服'
            }, {
                prop: 'accountId',
                label: '账号ID'
            }, {
                prop: 'roleId',
                label: '角色ID'
            }, {
                prop: 'roleGrade1',
                label: '角色等级'
            }, {
                prop: 'roleGrade2',
                label: '类型'
            }, {
                prop: 'VIPGrade1',
                label: '名称'
            }, {
                prop: 'VIPGrade2',
                label: '操作'
            }, {
                prop: 'VIPGrade4',
                label: '更换后战力变动值'
            }, {
                prop: 'VIPGrade5',
                label: '变动前战力'
            }, {
                prop: 'VIPGrade6',
                label: '变动后战力'
            }]
        }
    },
    computed: {
        xlsx() {
            return this.title + '.xlsx'
        }
    },
    methods: {
        // 通用 成功 与 失败
        successFun(data) {
            this.$message({
                message: data,
                type: 'success'
            });
        },
        errorFun(data) {
            this.$message.error(data);
        },
        // 分页器
        // 控制每页的数量
        handleSizeChange(val) {
            this.pageSize = val;
            this.tableControl();
        },
        // 页数
        handleCurrentChange(val) {
            this.currentPage = val;
            this.tableControl();
        },
        tableControl() {
            this.tableData = this.tableDataAll.slice((this.currentPage - 1) * this.pageSize, this.currentPage * this.pageSize)
        },
        // 时间改变 得到起始时间和结束时间
        dateChange(val) {
            var t = val.split(' - ')
            this.form.dateStart = t[0];
            this.form.dateEnd = t[1];
        },
        // 平台切换 渠道切换 区服切换
        selectPlats(val) {
            this.getData(`updatePlatform.do?platformid=${val}`)
        },
        selectChannels(val) {
            this.getData(`updateChannel.do?channelid=${val}`)
        },
        selectServers(val) {
            this.getData(`updateServer.do?serverid=${val}`)
        },
        selectTypes(val) {

        },
        // 提交数据
        commitData() {
            var that = this;
            var p = new Promise(function(resolve, reject) {
                var obj = {
                    "dateStart": that.form.dateStart,
                    "dateEnd": that.form.dateEnd,
                    "userid": that.form.auID,
                    "roleid": that.form.roleId,
                    "platform": that.form.plat,
                    "channel": that.form.channel,
                    "serverid": that.form.serviceArea,
                    'changeType': that.form.type
                }
                that.dataTotal = 0;
                that.loading = true;
                that.tableData = [];
                that.tableDataAll = [];
                that.$http.jsonp(`${that.SRC}fightValueChange/search.do`, {
                    params: {
                        params: JSON.stringify(obj)
                    }
                }).then(function(res) {
                    resolve(res.body)
                })
            })
            p.then(function(value) {
                that.loading = false;
                var data = JSON.parse(JSON.parse(value));
                if (parseInt(data["res"]) === 0) {
                    that.dataTotal = data.data.length;
                    if (data.data.length === 0) {
                        that.errorFun("该角色暂无数据！")
                    } else {
                        that.tableDataAll = arrayToObject(that.tableHeader, data.data);
                        that.tableControl();
                    }
                } else {
                    that.errorFun(data["msg"])
                }
            })
        },
        // 搜索
        search(form) {
            this.$refs[form].validate((valid) => {
                if (valid) {
                    this.commitData()
                } else {
                    this.errorFun('请完善输入的值！');
                    return false;
                }
            });
        },
        //重置
        reset(form) {
            this.$refs[form].resetFields();
            this.getData("initParam.do");
        },
        /*获取区服列表数据*/
        getData: function(url) {
            var that = this;
            // 将数据push到选择框中
            var pushData = function(pushArr, attr, data) {
                that[pushArr] = [];
                for (var i in data[attr]) {
                    that[pushArr].push({
                        label: i,
                        value: data[attr][i]
                    })
                }
            };
            var p = new Promise(function(resolve, reject) {
                that.$http.jsonp(`${that.SRC }fightValueChange/${url}`).then(function(res) {
                    resolve(res.body)
                })
            });
            p.then(function(value) {
                var data = JSON.parse(JSON.parse(value));
                if (parseInt(data["res"]) === 0) {
                    // 后台select的数据
                    var lists = ["platformItmes", "channelItmes", "serverItmes", "fightChangeList"];
                    // 页面select名字
                    var nameLists = ["plats", "channels", "serviceAreas", "types"];
                    for (var i = 0; i < lists.length; i++) {
                        if (data[lists[i]] !== undefined) {
                            pushData(nameLists[i], lists[i], data);
                        }
                    }
                } else {
                    that.getErrorMsg(Number(data.res))
                }
            })
        },
        /*设置初始值*/
        _init() {
            window.addEventListener('resize', function() {
                /*修改表格的宽度*/
                this.realTimeServiceTableWidth = document.body.clientWidth - 240 + "px";
                this.realTimeServiceContent = document.body.clientWidth - 220 + "px";
            }.bind(this))
        },
        // 表格下载
        excel() {
            this.downloadExl(this.tableHeader, this.tableDataAll, this.title, this.title);
        }
    },
    mounted() {
        this._init()
        this.SRC = this.$store.getters.src2;
        this.form.dateOne = [new Date(new Date().getTime() - 86400000), new Date()];
        this.getData("initParam.do")
            // this.getData(this.pageSize,this.currentPage)
    }
}